import {useContext} from "react";
import {DataContext} from "../provider/DataProvider.tsx";
import '../style/hotTag.scss'
import {Link} from "react-router-dom";
export default function() {
    const dataContext = useContext(DataContext)
    const tags = dataContext?.hotTags || [];
    return  <div className='hot-tag-container'>
        <div className='tag-title'>热门标签</div>
        <div className='tag-list'>
            {
                tags.map(tag=> (
                        <Link to={`/?tag=${tag.tagName}`}
                              key={tag.tagName}  className='tag-text'>{tag.tagName}
                        </Link>
                    ))
            }
        </div>

    </div>
}